<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org"
      xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head th:include="include :: header"></head>
<body class="hold-transition skin-blue sidebar-mini">

<section class="content-header">
    <h1 style="display: inline-block">
        库存划项目标记操作
    </h1>
    <button onclick="javascript:window.history.back();" type="button" class="btn btn-success"
            style="text-align:center;vertical-align:middle;font-size:30px;position:absolute;right:3%;display: inline-block;background-color: transparent;border: none;color: #5c5c5c;outline:none;">
        <i style="-moz-transform:scaleX(-1);-webkit-transform:scaleX(-1);-o-transform:scaleX(-1);transform:scaleX(-1);filter:FlipH;"
           class="glyphicon glyphicon-share-alt"></i><span
            style="margin-left: 5px;font-size: 16px;position: absolute;top: 20%;">返回</span>
    </button>
</section>
<section class="content">
    <div class="row">
        <div class="col-xs-12">
            <div class="box">
                <div class="box-header">
                    <form id="queryForm" action="/material/ityToPro/inventoryExport">
                        <div class="row">
                            <div class="form-inline">
                                <div class="form-group">
                                    <label>原料类型</label>
                                    <input type="text" name="matTypeName"
                                           class="form-control"
                                           placeholder="请输入原料类型">
                                </div>
                                <div class="form-group">
                                    <label>原料材质</label>
                                    <input type="text" name="matQualityName" class="form-control"
                                           placeholder="请输入原料材质">
                                </div>
                                <div class="form-group">
                                    <label>原料规格</label>
                                    <input type="text" name="matSpecName" class="form-control"
                                           placeholder="请输入原料规格">
                                </div>
                                <div class="form-group">
                                    <label>宽度</label>
                                    <input type="number" step="0.1" name="matWidth" class="form-control"
                                           placeholder="请输入原料宽度">
                                </div>
                                <div class="form-group">
                                    <label>长度</label>
                                    <input type="number" step="0.1" name="matLength" class="form-control"
                                           placeholder="请输入原料长度">
                                </div>
                                <div class="form-group">
                                    <label>米重/厚度</label>
                                    <input type="number" step="0.1" name="matHeight" class="form-control"
                                           placeholder="请输入原料米重/厚度">
                                </div>
                                <div class="form-group">
                                    <label>库位</label>
                                    <select class="form-control" name="whiId" onchange="changewhiIdListStr(this)">
                                        <option value="">请选择</option>
                                        <option th:each="type:${warehouse}" th:value="${type.whiId}"
                                                th:text="${type.whiName}"
                                                th:selected="${type.whiName eq '原料库'}"></option>
                                    </select>
                                    <input name="whiIdListStr" type="hidden" style="display: none" />
                                </div>
                                <button type="button" class="btn btn-success" id="btn-selectStock">搜索</button>
                            </div>
                        </div>
                    </form>
                </div>
                <div class="row" id="toolbar">
                    <div class="form-inline">
                        <button type="button" id="btn_exportExcel"
                                class="btn btn-primary">
                            导出
                        </button>
                    </div>
                </div>
                <div class="box-body">
                    <table id="bootstrap-stock-table"></table>
                </div>
            </div>
        </div>
    </div>
</section>
<div th:include="include :: footer"></div>
<script th:inline="javascript">

    /**加载表格*/
    var table;
    /**
     * 库位改变事件
     * */
    function changewhiIdListStr(obj){
        $("#queryForm [name='whiIdListStr']").val($(obj).val().join(','));
    }
     $(function () {

        table = js.table.init({
            id: "bootstrap-stock-table",
            url: ctx + "matInvManage/complex/list",
            showExport: false,
            queryData: {ityInType: 1, ityAvaWeightZeroFlg: 2},
            columns: [
                {
                    title: '序号', field: '', width: '40',
                    formatter: function (value, row, index, field) {
                        return index + 1;
                    }
                },
                {title: '类型', field: 'matTypeName'},
                {title: '材质', field: 'matQualityName'},
                {title: '规格', field: 'matSpecName'},
                {title: '宽度', field: 'matWidth'},
                {title: '长度', field: 'matLength'},
                {title: '米重/厚度', field: 'matHeight'},
                {title: '特殊说明', field: 'itySpec'},
                {title: '可用数量', field: 'ityAvaNum'},
                {title: '可用重量', field: 'ityAvaWeight'},
                {title: '库位', field: 'whiName'}
            ],
            rowStyle: function (row, index) {
                if (row.itySpec != null && row.itySpec.indexOf("不合格") >= 0) {
                    return {css: {"color": "red"}}
                } else {
                    return {css: {"color": "black"}}
                }
            }
        });

        /** 表格搜索库存在库 */
        $("#btn-selectStock").click(function () {
            js.table.search(table);
        });

        /**
         * 导出Excel
         */
        $("#btn_exportExcel").click(function () {
            $("#queryForm").submit();
        });
    })
</script>
</body>
</html>